<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
		<title>首页</title>
		<link rel="stylesheet" type="text/css" href="css/public.css"/>
	</head>
	<style type="text/css">
		body{background: #fff;font-size: 0.3rem;color: #969696;}
		.header img{width: 7.5rem;height: auto;display: block;}
		.banner img{width: 7.5rem;height: auto;}
		.nav{height: 4rem;padding: 0 0.4rem;}
		.row{height: 2rem;}
		.row .icon img{width: 0.8rem;height: auto;}
		.row .icon p{margin-top: 0.1rem;}
		.adv{margin: 0.5rem 0;}
		.adv img{width: 5.32rem;}
		.footer{height: 2.5rem;width: 7.5rem;position: relative;}
		.footer img{width: 7.5rem;height: 2.5rem;display: block;}
		.footer .box{height: 1.35rem;width: 1.25rem;position: absolute;color: #fff;text-align: center;}
		.footer .box img{width: 0.9rem;height: auto;margin-left: 0.2rem;margin-bottom: 0.1rem;}
		.register{left: 0.6rem;top: 0.7rem;}
		.login{right: 0.6rem;top: 0.6rem;}
		.login_on{position: absolute;top: 1.2rem;left: 5.7rem;color: #fff;text-decoration: underline;display: none;}
		.down{position: absolute;top: 1.2rem;left: 0.7rem;color: #fff;display: none;}
		/*注册*/
		 .model{position: fixed;height: 100%;width: 100%;background: rgba(0,0,0,.3);top: 0;left: 0;z-index: 2;}
		 .modelcont{height: 7rem;width: 6.73rem;background: #fff;border-radius: 5px;padding-top: 0.1rem;position: absolute;top: 2.5rem;left: 0.38rem;z-index: 2;}
		 .modelhead{height: 1rem;text-align: center;font-size: 0.5rem;line-height: 1rem;margin-bottom: 0.5rem;}
		 .contmodel{height: 2.5rem;font-size: 0.32rem;}
		 .contmodel lable{margin-left: 0.5rem;}
		 .contmodel lable input{border-bottom: 1px #c3c3c3 solid;height: 0.46rem;margin-left: 0.1rem;width: 4.3rem;font-size: 0.3rem;}
		 .verification-btn{height: 0.6rem;width: 1.8rem;font-size: 0.28rem;border:solid 1px #999;border-radius: 5px;margin-top: 0.15rem;margin-left: 0.1rem;}
		 #submit{height: 0.93rem;width: 4.55rem;background: #0e84de;font-size: 0.36rem;color: #fff;margin: 0.5rem auto;border-radius: 5px;cursor: pointer;}
		 .agreement{font-size: 0.26rem;margin-top: 0.2rem;}
		 .agreement a{color: #2395dc;text-decoration: underline;}
		 .agreement img{width:auto;height: 0.34rem;margin-left: 0.2rem;margin-right: 0.05rem;}
		 /*登录*/
		 .contmodellogin{height: 2rem;font-size: 0.32rem;}
		 .contmodellogin lable{margin-left: 0.5rem;}
		 .contmodellogin lable input{border-bottom: 1px #c3c3c3 solid;height: 0.46rem;margin-left: 0.1rem;width: 4.3rem;font-size: 0.3rem;}
		 .modellogin{height: 5rem;width: 6.73rem;background: #fff;border-radius: 5px;padding-top: 0.1rem;position: absolute;top: 3.5rem;left: 0.38rem;z-index: 2;}
		  #loginsb{height: 0.93rem;width: 4.55rem;background: #0e84de;font-size: 0.36rem;color: #fff;margin: 0rem auto;border-radius: 5px;cursor: pointer;}
	</style>
	<body>
		<!-- header -->
		<div class="header">
			<img src="img/inedx_header.png"/>
		</div>
		<!-- banner -->
		<div class="banner">
			<img src="img/banner.png"/>
		</div>
		<!-- nav功能菜单 -->
		<div class="nav">
			<div class="row flex flex-align-center flex-pack-center">
				<div class="icon flex flex-align-center flex-pack-center flex-v flex-1" data-key='SK'>
					<img src="img/shoukaun.png"/>
					<p>收款</p>
				</div>
				<div class="icon flex flex-align-center flex-pack-center flex-v flex-1" data-key='DD'>
					<img src="img/order.png"/>
					<p>我的账单</p>
				</div>
			</div>
			<div class="row flex flex-align-center flex-pack-center">
				<div class="icon flex flex-align-center flex-pack-center flex-v flex-1" data-key='KF'>
					<img src="img/kefu.png"/>
					<p>客服中心</p>
				</div>
				<div class="icon flex flex-align-center flex-pack-center flex-v flex-1" data-key='AUTH'>
					<img src="img/auth.png"/>
					<p>认证中心</p>
				</div>
			</div>
		</div>
		<!-- adv联系电话 -->
		<div class="adv flex flex-align-center flex-pack-center">
			<img src="img/advtel.png"/>
		</div>
		<!-- footer底部登录注册 -->
		<div class="footer">
			<img src="img/index_footer.png"/>
			<div class="box register">
				<img src="img/register.png" alt="" />
				<p>立即注册</p>
			</div>
			<div class="box login" >
				<img src="img/login.png" alt="" />
				<p>立即登录</p>
			</div>
			<p class="login_on"></p>
			<p class="down">App下载</p>
		</div>
		<!-- 注册model框 -->
		<div class="model" hidden></div>
		<div class="modelcont" hidden>
				<div class="modelhead" >注册</div>
				<div class="contmodel">
					<lable>
						手机号:
						<input type="number" id="phone"/>
					</lable>
					<lable>
						密码:
						<input style="margin-left: 0.4rem;margin-top: 0.3rem;" type="password" id="password"/>
					</lable><br />
					<div class=" flex">
						<lable>
						验证码:
						<input style="margin-top: 0.3rem; width: 2.3rem;" type="number" id="verification"/>
					</lable>
					<div class="verification-btn flex flex-align-center flex-pack-center"><p>获取验证码</p></div>
					</div>					
				</div>
				<div id="submit" class="flex flex-align-center flex-pack-center"><p>确定</p></div>
				<div class="agreement flex flex-align-center flex-pack-center">
					<img src="img/checked.png"/>
					<p>我已阅读并同意<a href="http://www.uniao.me/share/agreement.htm?topUserId=2000">优鸟钱包用户协议&nbsp;&gt;&gt;</a></p>
				</div>
			</div>
		<!-- 登录model框 -->
		<div class="modellogin" hidden>
				<div class="modelhead">登录</div>
				<div class="contmodellogin">
					<lable>
						手机号:
						<input type="number" id="login_phone"/>
					</lable>
					<div style="height: 0.1rem;"></div>
					<lable>
						密码:
						<input style="margin-left: 0.4rem;margin-top: 0.3rem;" type="password" id="login_password"/>
					</lable>				
				</div>
				<div id="loginsb" class="flex flex-align-center flex-pack-center"><p>确定</p></div>
		</div>
	</body>
	<script type="text/javascript" src="js/rem.js"></script>
	<script type="text/javascript" src="js/jquery-3.1.1.min.js"></script>
	<script type="text/javascript" src="js/layer.js"></script>
	<script type="text/javascript" src="js/jquery.base64.js"></script>
	<script type="text/javascript" src="js/api.js"></script>
	<script type="text/javascript" src="js/common.js"></script>
	<script type="text/javascript" src="js/index.js"></script>
	<script type="text/javascript">
		if(localStorage.userId){
			$('.login').hide();
			$('.register').hide();
			if(localStorage.userName != ''){
				$('.login_on').show().text('Hi,'+localStorage.userName);
			}else{
				$('.login_on').show().text('Hi,'+localStorage.userId);
			}
			$('.down').show();
		}
	</script>
</html>
